﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>曾豪</title>
    
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <meta name="apple-mobile-app-capable" content="yes">
    <meta name="apple-mobile-app-status-bar-style" content="black">
   
    <meta name="description" content="一只叫做黑夜的阿宅，想成为家喻户晓的大侠">
    <meta name="keywords" content="二次元，宅属性，前端，编程，全栈，绘画，设计">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="author" content="cononico">
    <meta name="application-name" content="Cononico" >

    <link rel="stylesheet" type="text/css" href="main.css">
    <link rel="stylesheet" type="text/css" href="process.css">
    <link rel="shortcut icon"  type="x-icon" href="favicon.ico" />
    
    <script type="text/javascript">
        //设定rem值
        document.getElementsByTagName("html")[0].style.fontSize = document.documentElement.clientWidth/20 + 'px';
    </script>
</head>
<body>
    <header class="head">
        <div class="head_logo_div">
            <img class="logo_img" src="QQ图片20170511203134.jpg"></a>
        </div>
        <div class="head_nav_div">
             <nav class="head_nav">
                <ul id="nav_ul">
                    <li class="nav_li_on nav_ul_li">Home</li>
                    <li class="nav_ul_li">Skill</li>
                    <li class="nav_ul_li">Experience</li>
                    <li class="nav_ul_li">Hobby</li>
                    <li class="nav_ul_li">Contact</li>
                </ul>
            </nav>
        </div>
        <div class="clear"></div>
    </header>
    
    <ul class="float_btn" id="float_btn">
        <li class="btn_on"></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
    
    <div class="wrapBox" id="wrapBox">
        <div class="box">
            <img class="box_bg" src="1234.jpg">
            <div class="box01_content">
                <div class="123_div">
                    <div class="cycle_item">
                        <a  class="github_a" id="github_a" target="_blank">
                            <span class="github_icon"></span>
                            <span class="github_text"><p class="item_name">GitHub</p></span>
                        </a>
                        <a class="weibo_a" id="weibo_a" target="_blank">
                            <span class="weibo_icon"></span>
                            <span class="weibo_text"><p class="item_name">微博</p> </span>
                        </a>
                        <a  class="blog_a" id="blog_a" target="_blank">
                            <span class="blog_icon"></span>
                            <span class="blog_text"><p class="item_name"> 博客</p></span>
                        </a>

                        <div class="green_cycle">
                            <img class="green_cycle_img" src="green_cycle.svg">
                            <div class="yellow_cycle">
                                <img class="yellow_cycle_img" src="yellow_cycle.svg">
                                <div class="blue_cycle">
                                    <img class="blue_cycle_img" src="blue_cycle.svg">
                                    <div class="head_img_div">
                                        <img class="head_img" src="QQ图片20170511203134.jpg">
                                    </div>
                                    <p>曾豪</p>
                                </div>
                            </div>
                        </div>
                    </div>
                                    </div>
                <h1 class="title">
                <h2 class="title_h2">
                <div id="box01_text">
                <p class="box01_p">
                <p class="box01_p">
                <p class="box01_p">
                </div>

            </div>
            <div class="arrow_div">
                <img class="arrow_img" src="arrowhead.png">
            </div>
        </div>
        
        <div class="box">
            <img class="box_bg" src="131.jpg">
            
            <div class="box02_content box_content">
                <div id='bar_container' class="bar_container">
                    <div class='bar mint' data-percent='70' data-skill='C语音程序设计'></div>
                    <div class='bar red' data-percent='50' data-skill='JavaScript'></div>
                    <div class='bar lila' data-percent='50' data-skill='网络技术'></div>
                    <div class='bar orange' data-percent='50' data-skill='Node.js'></div>
                    <div class='bar gray' data-percent='30' data-skill='Java+C++'></div>
                    <div class="bar green" data-percent='60' data-skill='图形图像处理'></div>
                </div>
                <div id="box02_text">
                    <h1>我的时光轴</h1>
                    <div class="overline"></div>
                    <p>2016年,我第一次进入到大学的学习</p>
                    <p>九月份接触了各种专业知识</p>
                    <p>2017,年初的时候摸了摸Android，觉得稀奇有趣</p>
                    <p>后面一直专注设计</p>
                    <p>现在正在学习前端工程化技术</p>
                    <p>喜欢UI,交互设计,觉得UED是我坚持精确1个像素的动力</p>
                    <p>而未来...</p>
                    <p>想成为一名工程师</p>
                </div>
                <div class="clear"></div>
            </div>
            
            <div class="arrow_div">
                <img class="arrow_img" src="arrowhead.png">
            </div>
            
        </div>
        
        <div class="box">
            <img class="box_bg" src="222.jpg">
            
            <div class="box_content box03_content">
                <ul id="timeUl" class="timeUl">
                    <li>
                        <div>
                            <h1>2016-至今
                            <p>四川华新现代职业学院</p>
                            <p>专业：计算机应用技术</p>
                            <p>在风气不佳的考试战场中险些挂科</p>
                            <p>最喜欢的科目是动画制作<p>
                            <p>现在正在愁于毕业设计</p>
                   
                          </li>
                          <li>
                          <div>
                            <h1>2016.9-2017.5</h1>
                            <p>有过多种兼职服务</p>
                            <p>发传单</p>
                            <p>小菜馆</p>
                            <p>传菜生</p>
                            <p>前途多艰</p>
                        </div>
                    </li>
                    <li>
                       <div>
                            <h1>未来</h1>
                            <p>一个未知数</p>
                            <p>我会一步一步</p>
                            <p>前行</p>
                        </div>
                    </li>
                </ul>
                 <div class="left_div" id="left_div">
                     <img class="left_arrow" src="arrowleft.png">
                 </div>
                 <div class="right_div" id="right_div">
                      <img class="right_arrow" src="arrowright.png">
                 </div>
            </div>
            
             <div class="arrow_div">
                <img class="arrow_img" src="arrowhead.png">
            </div>
        </div>
        
        
        <div class="box">
            
            <img class="box_bg" src="111.jpg">
            <div class="box_content box04_content">
               
                
                    
                        
                    </li>
                    <li class="hobby_02">
                        <div class="hobby_img_div">
                            <div class="spinner spinner_02"></div>
                            <div class="hobby_img">
                                <img src="QQ图片20170511203134.jpg">
                            </div>
                            <div class="hobby_img_info">
                               
                                <h1>人生感悟</h1>
                            </div>
                        </div>
                        <div class="hobby_text_div">
                            <div class="hobby_img_info_mob">
                   
                            </div>
                            <p class="about_p">
                                     人的一生是漫长的，生活是多姿多彩的。人生是一幅画，每个人出生的时候，是
                                 一张宣腾腾的画纸成长的经历过程就是为了这张画纸描绘出图案，有的人成功了；有
                                 的人失败了，无论成功与失败，大多数的人却在图画中忘记了最初的那个纯真的梦。  
                          
        <foot id="foot" class="foot">
                                                                                                                        
    <script type="text/javascript" src="main.js"></script>
</body>
    
</html>

 